<template>
  <d-modal style="width: 500px" v-model="visible" title="添加代码源">
    <d-alert type="info" :closeable="false">
      应用授权的回填地址请填写:<br />
      <a traget="_blank">{{ hostPath }}</a>
    </d-alert>
    <d-form :data="formData" style="margin-top: 10px">
      <d-form-item field="source" label="仓库类型">
        <d-select
          v-model="formData.sourceType"
          :options="sourceOption"
          @value-change="formData.source = null"
        ></d-select>
      </d-form-item>
      <d-form-item v-if="formData.sourceType === 1" field="sourceType" label="代码源">
        <d-select v-model="formData.source" :options="gitSourceTypeOption"></d-select>
      </d-form-item>
      <d-form-item v-if="formData.sourceType === 2" field="sourceType" label="代码源">
        <d-select v-model="formData.source" :options="svnSourceTypeOption"></d-select>
      </d-form-item>
      <d-form-item field="url" label="代码地址">
        <d-input v-model="formData.url" placeholder="请输入代码地址"></d-input>
      </d-form-item>
      <d-form-item field="appId" label="Application ID">
        <d-input v-model="formData.appId" placeholder="请输入Application ID" />
      </d-form-item>
      <d-form-item field="secret" label="Secret">
        <d-input v-model="formData.secret" placeholder="请输入Secret" />
      </d-form-item>
    </d-form>
    <template #footer>
      <div class="footer">
        <d-button @click="close" autofocus>取消</d-button>
        <d-button variant="solid" color="primary" @click="submit">前往授权</d-button>
      </div>
    </template>
  </d-modal>
</template>

<script setup lang="ts">
import { ref, reactive, defineExpose, computed, onMounted } from 'vue'
import { useRoute } from 'vue-router'
import {
  getCodeSettingCallBackValue,
  setCodeSettingCallBackValue,
  clearCodeSettingCallBackValue
} from '@/utils/cache'
import { saveCodeAuthDetailApi } from '@/api/setting/codesetting'

const route = useRoute()
const visible = ref(false)
const formData = reactive({
  source: 2,
  sourceType: 1,
  url: 'http://47.109.128.73:3000',
  appId: '83a4dff4-d798-4f67-ba35-c347e0932c7f',
  secret: 'gto_aeogsfzlkmeynbue3cmm3zahrdtmlf2fkgatqrauscsafty7omra',
  authContent: ''
})

onMounted(async () => {
  const callBackValue = getCodeSettingCallBackValue()
  if (callBackValue) {
    const data = JSON.parse(callBackValue)
    if (data.authContent === '') {
      clearCodeSettingCallBackValue()
      return
    }
    //Gitea
    if (data.source === 2 && data.sourceType === 1) {
      await saveGiteaAuthDetail(data)
    }
    clearCodeSettingCallBackValue()
  }
})

/**
 * 保存gitea授权信息
 * @param data
 */
const saveGiteaAuthDetail = async (data: any) => {
  const authCode = route.query.code
  data.authContent = JSON.stringify({ code: authCode })
  await saveCodeAuthDetailApi(data)
}

const hostPath = computed(() => {
  return window.location.protocol + '//' + window.location.host + window.location.pathname
})
const close = () => {
  visible.value = false
}
const submit = () => {
  let toUrl = formData.url
  if (formData.sourceType === 1 && formData.source === 2) {
    toUrl =
      toUrl +
      `/login/oauth/authorize?client_id=${formData.appId}&redirect_uri=${hostPath.value}&response_type=code&state=STATE`
  }
  setCodeSettingCallBackValue(JSON.stringify(formData))
  window.location.replace(toUrl)
}

const open = () => {
  visible.value = true
}

const sourceOption = ref([
  {
    value: 1,
    name: 'Git'
  },
  {
    value: 2,
    name: 'SVN'
  }
])

const gitSourceTypeOption = ref([
  {
    value: 1,
    name: 'Gitee'
  },
  {
    value: 2,
    name: 'Gitea'
  },
  {
    value: 3,
    name: 'GitLab'
  }
])
const svnSourceTypeOption = ref([
  {
    value: 4,
    name: 'Subversion'
  }
])

defineExpose({ open })
</script>

<style scoped lang="scss">
.footer {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 10px;
  margin: 10px;
}
</style>
